//响应式 管理事件处理机制
import tools from '../../../utils/tools';
import cartItem from '../../../templates/cartItem.tpl';

export default class Handle {
  constructor(courseData, cartData, oCart, observer) {
    this.courseData = courseData;
    this.cartData = cartData;
    //需要给cart容器里增加内容
    this.oCart = oCart;
    this.observer = observer;

    this.init();

  }

  init() {
    //增加观察者任务
    this.observer.add(this.handleCartItem.bind(this));
  }

  //增加/删除一项
  handleCartItem(id, target, state) {
    //如果 cartData 里 state: 1
    if (state) {
      //找到当前那一项 返回的是一个数组
      const itemData = this.courseData.filter(item => {
        if (item.id === id) {
          return item;
        }
      })[0];

      //增加一项
      const _item = tools().createElement(
        'li',
        tools().tplReplace(cartItem, {
          id: itemData.id,
          title: itemData.title,
          originPrice: itemData.coupon ? `<del>￥${itemData.price}.00</del>` : `￥${itemData.price}.00`,
          currentPrice: itemData.coupon ? `￥${Number(itemData.price) - Number(itemData.coupon)}.00` : '',
          coupon: itemData.coupon ? `￥${itemData.coupon}.00` : '暂无优惠券'
        })
      );

      this.oCart.appendChild(_item);
    } else {
      //如果 cartData 里 state: 0 删除该项
      const oParent = target.parentNode;
      oParent.remove();
    }
  }

}